@import './normalize.less';


.bg {
    position: relative;
    font-family: 'Avenir LT Std';
    height: 4.8rem;


    .triangle {
        position: absolute;
        top: -0.5733rem;
        right: -1.7867rem;
        opacity: 0.95;
        border-style: solid;
        transform: rotateZ(205deg);
        border-width: 0rem 3rem 3rem 3rem;
        border-color: transparent transparent #fe4775 transparent;
    }

    .back img {
        position: absolute;
        top: .64rem;
        left: .64rem;
        width: .2667rem;
        height:.3733rem;
    }

    h3 {
        position: absolute;
        top: 2.1333rem;
        left: .6667rem;
        font-size: 1.0667rem;
        line-height: 1.0933rem;
        letter-spacing: .1333rem;
        color: #fe4775;
        opacity: 0.7;
    }
}

.form {
    font-size: .3733rem;
    padding-left: .8rem;

    .form-item {
        position: relative;
        padding-bottom: .2667rem;
        // background-color: skyblue;
        width: 7.0933rem;
        // outline: .0533rem solid red;
        margin-bottom: .5333rem;

        .msg {
            color: #ff4d4f;
            position: absolute;
            left: 1.16rem;
            bottom: -0.3467rem;
        }

        input {
            background-color: transparent;
            width: 7.0933rem;
            height: .8rem;
            border-bottom: .0533rem solid #989898;
            ;
            border-radius: .0267rem;
            vertical-align: middle;
            text-indent: 2em;

            &::placeholder {
                font-size: .2933rem;
                color: #adadad;
            }
        }

        i {
            color: #ff4d4f;

        }

        .error input {
            border-color: #ff4d4f;
        }

        .submit {
            width: 6.3467rem;
            height: 1.0133rem;
            background-color: #635cb2;
            box-shadow: 0rem .08rem .16rem 0px rgba(0, 0, 0, 0.16);
            border-radius: .8rem;
            font-size: .48rem;
            letter-spacing: .08rem;
            color: #ffffff;
            text-align: center;
            line-height: 1.0133rem;
            border: none;
        }

        .code {
            position: absolute;
            left: 188px;
            top: 19px;
            width: 2.1333rem;
            height: .8267rem;
            background-color: #635cb2;
            color: #fff;
            text-align: center;
            line-height: .8267rem;
            font-size: .4267rem;
        }

        .icon {
            display: inline-block;
            width: .3467rem;
            height: .3467rem;
            background: url(../icon/对勾.png) no-repeat;
            background-size: contain;
        }

        .icon2 {
            background: url(../icon/对勾2.png) no-repeat;
            background-size: contain;
        }

        .win_msg {
            color: #fe4775;
            padding-top: .3733rem;
            padding-left: .2933rem;
        }

        &:nth-last-child(2),
        &:nth-last-child(1) {
            position: absolute;
            left: 50%;
            top: 15.0933rem;
            transform: translateX(-50%);
            margin-bottom: .5333rem;
        }

        &:nth-last-child(2) {
            top: 13.4933rem;
            text-indent: 1em;
        }
    }
}